<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@  taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html lang="en">
<%@ include file="common/head.jsp"%>

<body class="fix-header fix-sidebar">

	<!-- Preloader - style you can find in spinners.css -->
	<div class="preloader">
		<svg class="circular" viewBox="25 25 50 50">
				<circle class="path" cx="50" cy="50" r="20" fill="none"
				stroke-width="2" stroke-miterlimit="10" /> </svg>
	</div>
	<!-- Main wrapper  -->
	<div id="main-wrapper">
		<!-- header header  -->
		<%@ include file="common/header.jsp"%>
		<!-- End header header -->
		<!-- Left Sidebar  -->
		<%@ include file="common/nav.jsp"%>
		<!-- End Left Sidebar  -->
		<!-- Page wrapper  -->
		<div class="page-wrapper">
			<!-- 锐高软件 -->
			<%@ include file="../common/ruigao.jsp"%>

			<!--
                    	作者：offline
                    	时间：2018-03-26
                    	描述：查看员工信息
                    -->
			<div class="container-fluid">

				<div class="row justify-content-center">
					<div class="col-12">
						<div class="card">
							<div class="card-body">
								<div class="card-content">
									<!-- Left sidebar -->
									<div class="inbox-leftbar">
										<a class="btn btn-danger btn-block waves-effect waves-light"
											href="${pageContext.request.contextPath}/user_add.jsp"> <font
											style="vertical-align: inherit;"> <font
												style="vertical-align: inherit;">添加员工</font>
										</font>
										</a>

									</div>

								</div>
								<!-- End Left sidebar -->

								<div>

									<div role="toolbar" >
										<div class="btn-group">
											<button class="btn btn-light waves-effect" type="button">
												<i class="mdi mdi-archive font-18 vertical-middle"></i>
											</button>
											<button class="btn btn-light waves-effect" type="button">
												<i class="mdi mdi-alert-octagon font-18 vertical-middle"></i>
											</button>
											<button class="btn btn-light waves-effect" type="button">
												<i class="mdi mdi-delete-variant font-18 vertical-middle"></i>
											</button>
										</div>

										<%@ include file="listall/companyall.jsp"%>
										<div class="btn-group show">
											<button aria-expanded="false" data-toggle="dropdown"
												class="btn btn-light dropdown-toggle waves-effect"
												type="button">
												<font style="vertical-align: inherit;"><font
													style="vertical-align: inherit;"><font
														style="vertical-align: inherit;"><font
															style="vertical-align: inherit;"> 公司 </font></font></font></font><span
													class="caret m-l-5"></span>
											</button>
											<div class="dropdown-menu" x-placement="bottom-start"
												style="position: absolute; transform: translate3d(0px, 48px, 0px); top: 0px; left: 0px; will-change: transform;">
												<c:forEach var="company" items="${selectcompany}">
													<a href="userServlet?companyid=${company.companyId}" class="dropdown-item">${company.companyName}</a>
												</c:forEach>
											</div>
										</div>

									</div>

									<div class="mt-4">
										<br />
										<table class="table">
											<thead>
												<tr>
													<th>员工姓名</th>
													<th>部门</th>
													<th>员工职位</th>
													<th>员工电话</th>
													<th>操作</th>
												</tr>
											</thead>
											<tbody>

												<c:forEach items="${pageInfo.getPageList()}" var="users">
													<tr>
														<td>${users.userName }</td>
														<c:forEach items="${deptList}" var="depts">
															<c:if test="${depts.deptId eq users.deptId }">
																<td>${depts.deptName }</td>
															</c:if>
														</c:forEach>
														<td>${users.userPosition }</td>
														<td>${users.userPhone }</td>
														<td>
															<button type="button"
																class="btn btn-success btn-sm btn-rounded m-b-2 m-l-5 selectuser"
																style="background: #03a9f4;">
																<a href="${pageContext.request.contextPath}/userServlet?userid=${users.userId}&opt=selectuser"
																style="color: white;">查看</a> 
															</button> 
															<input type="hidden" name="opt" class="opt" value="">
															<button type="button"
																class="btn btn-success btn-sm btn-rounded m-b-2 m-l-5 upuser">
																<a href="${pageContext.request.contextPath}/userServlet?userid=${users.userId}&opt=upuser"
																	style="color: white;">编辑</a> <input type="hidden"
																	name="userid" id="upuserid" value="${users.userId}">

															</button>
															
															<button type="button"
																class="btn btn-danger btn-sm btn-rounded m-b-2 m-l-5 " name="dels" > 
																<input type="hidden" name="del" value="${users.userId }" id="delid">
																
																删除</button>
												
																
											
																
														</td>
													</tr>
												</c:forEach>
											</tbody>
										</table>
									</div>
									<!-- panel body -->

									<!-- panel -->

									<!--
                                                 	作者：offline
                                                 	时间：2018-04-08
                                                 	描述：上一页下一页
                                                 -->
									 <div class="table-responsive m-t-40">
										<div id="example23_wrapper" class="dataTables_wrapper">
											<div class="dataTables_paginate paging_simple_numbers"
												id="example23_paginate">
											    <a href="userServlet?PageNo=1&companyid=${company}" class="paginate_button"
													aria-controls="example23" data-dt-idx="7" tabindex="0"
													id="example23"> <font style="vertical-align: inherit;">
														<font style="vertical-align: inherit;"></font>首页
												</font>
												</a>
											    
											    <c:if test="${pageInfo.getHasPrevPage() }">
															<a  href="userServlet?PageNo=${pageInfo.getPrevPage()}&companyid=${company}" class="paginate_button previous disabled"
													aria-controls="example23" data-dt-idx="0" tabindex="0"
													id="example23_previous"><font
													style="vertical-align: inherit;"><font
														style="vertical-align: inherit;">上一页</font></font>
												</a>
												</c:if>
												<span>
												
												 <c:forEach items="${pageInfo.groupPage}" var="pageI">
													<a href="userServlet?PageNo=${pageI}&companyid=${company}"
													class="paginate_button" aria-controls="example23"
													data-dt-idx="7" tabindex="0" id="example23"> <font
													style="vertical-align: inherit;"> <font
														style="vertical-align: inherit;">${pageI }</font></font>
												   </a>
												</c:forEach>
												</span>
														
												<c:if test="${pageInfo.getHasNextPage()}">
									            	<a 	href="userServlet?PageNo=${pageInfo.getNextPage()}&companyid=${company}"
													class="paginate_button next" aria-controls="example23"
													data-dt-idx="7" tabindex="0" id="example23_next"><font
													style="vertical-align: inherit;"><font
														style="vertical-align: inherit;">下一页</font></font></a>
													</c:if>
													
													<a href="userServlet?PageNo=${pageInfo.getTotalPage()}&&companyid=${company}"
													class="paginate_button" aria-controls="example23"
													data-dt-idx="7" tabindex="0" id="example23"> <font
													style="vertical-align: inherit;"> <font
														style="vertical-align: inherit;"></font>末页
												</font>
												</a>
											</div>
										</div>
									</div>  
									
									
									
									
								
								</div>

							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<!-- End Container fluid  -->
	<!-- footer -->
	<%@ include file="common/footer.jsp"%>
	<!-- End footer -->
	<!-- End Page wrapper  -->
	<%@ include file="common/js.jsp"%>
	<!--
        	作者：offline
        	时间：2018-04-09
        	描述：点击删除按钮弹窗
        -->

	<script type="text/javascript">
		$(function() {
             
			//判断当前登录的员工的权限
			var competence = ${competence};
			if(competence!=3){
				$(".show").html("");
			}
			

			//点击公司要进行筛选
			$("#val-company")
					.change(
							function() {
								var companyoptions = $("#val-company option:selected");
								var companyid = parseInt(companyoptions.val());
								$.ajax({
									url : "userServlet",
									data : {
										"companyid" : companyid
									},
									type : "GET",
									dataType : "JSON",
									success : function(data) {

									},
									error : function(data) {

									}

								});

								

								//点击添加
								$(".upuser").click(
										function() {
											var userid = $(this).find(
													"#upuserid").val();
											$(".opt").val("upuser");
											var opt = $(".opt").val();

											$.ajax({
												url : "userServlet",
												data : {
													"userid" : userid,
													"opt" : opt
												},
												type : "GET",
												dataType : "json",
												success : function(data) {

												},
												error : function(data) {

												}
											});
										});
								
							
									    //点击删除
										$("button[name='dels']").click(function() {
											
													var userid = $(this).find("#delid").val();
													$(".opt").val("del");
													var del = $(".opt").val();
													swal(
															{
																title : "您确定要删除该员工吗？",
																animation : "slide-from-top",
																showCancelButton : true,
																closeOnConfirm : false,
																cancelButtonText : "取消",
																confirmButtonText : "确定"

															},
															function(inputValue) {
																if (inputValue === false)
																	return false;
																$.ajax({
																			url : "${pageContext.request.contextPath}/userServlet",
																			type : "GET",
																			data : {
																				"opt" : del,
																				"userid" : userid
																			},
																			datatype : "JSON",
																			success : function(
																					data) {
																				if (data) {
																					swal(
																							{
																								title : "操作成功,<span style='color:red'>已删除</span>员工",
																								html : true,
																								type : "success",
																								showCancelButton : false,
																								showConfirmButton : true,
																								confirmButtonText : "确定",
																							},
																							function() {
																								location
																										.reload();
																							});
																				} else {
																					swal({
																						title : '操作失败！',
																						type : 'error',
																						confirmButtonText : '确定',
																						closeOnConfirm : false
																					});
																				}
																			},
																			error : function(
																					data) {
																				swal({
																					title : '操作失败！',
																					type : 'error',
																					confirmButtonText : '确定',
																					closeOnConfirm : false
																				});
																			}

																		});
															});
												});

							});
		});
	</script>
</body>

</html>